import { createRouter, createWebHashHistory } from 'vue-router'
import Login from '../views/Login.vue'
import MainBox from '../views/MainBox.vue'
import RoutesConfig from './config'
import store from '../store/index'
const routes = [{
        path: "/login",
        name: "login",
        component: Login
    }, {
        path: "/mainbox",
        name: "mainbox",
        component: MainBox
    }
    // mainbox的嵌套路由，后面根据权限动态添加

]

const router = createRouter({
    history: createWebHashHistory(),
    routes
})

// router.addRoute("mainbox", {
//     path: "/index",
//     component: Home
// })

// router.addRoute("mainbox", {
//     path: "/center",
//     component: Center
// })


// RoutesConfig.forEach(item => {
//     router.addRoute("mainbox", item)
// })
// 上面没有加路由过滤，没权限也能进入

// 采用beforeEach做路由过滤，如果没登录就直接跳转到登录界面
// 每次路由跳转之前
// router.beforeEach( to , from ,next) 介绍
// to: 即将路由的地址
// form: 当前的路由地址，也就是马上要离开的地址
// next(): 执行进入下一个路由
// next(false): 禁止进入下一个路由
// next('/login'): 路由到/login地址

router.beforeEach((to, from, next) => {
    if (to.name === "login") {
        next()
    } else {
        // 如果授权(已经登录过了) next()
        // 未授权，重定向到login
        if (!localStorage.getItem("token")) {
            next({
                path: "/login"
            })
        } else {

            // 在beforeEach()中都会获取路由表存入store，然后从store取出动态加入此路由表。

            // 但是每次路由之前都会重新添加路由表，每次添加完路由表当前默认路径是首页（to.path显示内容）而不是登陆页面，
            // 页面会自动跳转到首页，但是如果这时候通过next(’/login’)跳转到登录页面，那么就会重新路由，在路由前又开始重新添加路由表，
            // 然后当前路径是首页，这时候又要跳转到登录页面因此就会出现死循环。

            // 这时候我们就不能反复加载路由表，加个判断条件就行了。
            if (!store.state.isGetterRouter) {

                //删除所有的嵌套路由
                router.removeRoute("mainbox")
                ConfigRouter()
                next({
                    path: to.fullPath
                })
            } else {
                next()
            }

        }
    }

})

const ConfigRouter = () => {

    if (!router.hasRoute("mainbox")) {
        router.addRoute({
            path: "/mainbox",
            name: "mainbox",
            component: MainBox
        })
    }
    RoutesConfig.forEach(item => {
        checkPermission(item) && router.addRoute("mainbox", item)
    })

    // 改变isGetterRouter =true
    store.commit("changeGetterRouter", true)
}

// 防止直接在地址栏输入 http://localhost:8080/#/user-manage/adduser进入
const checkPermission = (item) => {
    if (item.requireAdmin) {
        return store.state.userInfo.role === 1
    }
    return true
}






export default router